import React,{ useState, useEffect } from "react";
import { useNavigate } from "react-router-dom";
import { getToken } from "./auth";
const PrivateRoute = ({ component: Component, ...rest }) => {
  const navigate = useNavigate();
  const [isAuthenticated, setIsAuthenticated] = useState(false);

  useEffect(() => {
    // 在 useEffect 中检查身份验证
    const checkAuthentication = async () => {
      if (getToken()) {
        setIsAuthenticated(true);
      } else {
        // 如果未认证，重定向到登录页面
        navigate("/login");
      }
    };

    checkAuthentication(); // 调用检查身份验证的函数 // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []); // 空依赖数组确保此 useEffect 仅在组件挂载时执行一次

  if (!isAuthenticated) {
    return null; // 渲染空内容，等待身份验证检查完成后再重定向
  } // 如果已认证，渲染受保护的组件

  return <Component {...rest} />;
};

export default PrivateRoute;
